<template>
  <jl-base>
    <jl-header>
      <mt-header title="工程登录单" :fixed="true">
        <i slot="right">
          <mt-button @click="drafts">草稿箱</mt-button>
          <mt-button @click="make">新增</mt-button>
        </i>
      </mt-header>
    </jl-header>

    <jl-content>
      <div class="list_search_header w12">
        <input placeholder="搜索登录单号，使用单位，使用单位地址，电话等，可模糊搜索" v-model="condition">
        <span @click="search">搜索</span>
      </div>

      <div class="qd_list" v-infinite-scroll="loadMore"
           :infinite-scroll-disabled="loading"
           :infinite-scroll-distance="10">
        <mt-loadmore :top-method="loadTop" ref="loadmore" :topDistance="50">
          <template v-for="item in startOrders">
            <div class="qd_item">
              <div class="qd_header bor_bottom">
                <div class="w12 qd_address">
                  <em class="mr5">{{ item['BZMC'] }}</em>{{ item['DLD03MC'] }} - {{ item['DLD07'] }}
                </div>
                <div class="w12 mt10">
                  <span class="w12"><i class="fa fa-map-marker mr5"></i>{{ item['DLD45'] }}</span>
                  <span class="w06 mt10 tl"><i class="fa fa-file-text mr5"></i>{{ item['DLD01'] }}</span>
                  <span class="w06 mt10 tr"><i class="fa fa-clock-o mr5"></i>{{ item['DLD16'] }}</span>
                </div>
              </div>
              <div class="qd_body bor_bottom">
                <div class="w12 mt10" :class="{'Y':'font_green','N':'font_red'}[item['DLD31']]">
                  <h3 class="w06">{{ item['DLD31MC'] }}</h3>
                  <span class="w06 tr font_gray font_size_small">{{ item['DLD30'] }}</span>
                  <span class="w12 font_size_small">{{ item['DLD32'] }}</span>
                </div>
              </div>
              <div class="qd_footer mt10">
                <nut-button @click="tail(item)">跟进</nut-button>
                <nut-button v-if="item.DLD31 === 'Y'" @click="goContract(item)">签合同</nut-button>
              </div>
            </div>
          </template>
        </mt-loadmore>
        <jl-bottom-loading :class="{'false':'hide'}[loading]"/>
      </div>

      <div class="tips_no_pro" v-if="this.startOrders.length <=  0">
        <div class="tips_no_main">
          <div class="w12 tc font_gray_ccc" style="font-size:50px;"><i class="fa fa-sticky-note-o"></i></div>
          <div class="w12 tc font_size_super mt20 font_gray_ccc">暂无登录单记录</div>
        </div>
      </div>
    </jl-content>

  </jl-base>
</template>

<script>
  export default {
    data() {
      return {
        startOrders: [],
        loading: false,
        page_num: 1,
        isEnd: false,
        condition: ''
      }
    },
    methods: {
      make() {
        this.$router.push('/agent/start/new')
      },
      tail(item) {
        this.$router.push({
          path: '/agent/start/new',
          query: {
            jlbh: item.JLBH,
            bdbh: item.BDBH,
            BZ01: item.BZ01,
            PID: item.PID,
            SK01: item.SK01,
            DLD03: item.DLD03,
            DLD31: item.DLD31
          }
        })
      },
      drafts() {
        this.$router.push('/agent/start/drafts')
      },
      loadMore() {
        if (this.isEnd) return
        this.loading = true
        this.page_num++
        this.searchStartOrder()
      },
      search() {
        $Utils.loading()
        this.page_num = 1
        this.startOrders = []
        this.searchStartOrder().then(v => $Utils.hideloading()).catch(e => $Utils.hideloading())
      },
      searchStartOrder() {
        return new Promise((resolve, reject) => {
          this.$engineer.searchStartOrder({page_num: this.page_num, condition: this.condition}).then(v => {
            this.isEnd = false;
            let startOrders = v['startOrders'] || []
            if ($Utils.isNull(startOrders)) this.isEnd = true
            Array.prototype.push.apply(this.startOrders, startOrders)
            this.loading = false;
            this.$forceUpdate()

            resolve(v)
          }).catch(e => {
            this.loading = false

            reject(e)
          })
        })
      },
      goContract(item) {
        this.$router.push({name: 'agent-contract-new', params: {item: item}})
      },
      loadTop() {
        this.page_num = 1;
        this.$engineer.searchStartOrder({page_num: this.page_num})
          .then(v => {
            let startOrders = v['startOrders'] || []
            if ($Utils.isNull(startOrders)) this.isEnd = true
            this.startOrders = {...{}, ...startOrders};
            this.loading = false;
            this.$refs.loadmore.onTopLoaded();
            this.$forceUpdate()
          }).catch(e => {
          this.loading = false
        })
      }
    },
    activated() {
      this.startOrders = [];
      this.isEnd = true;
      this.searchStartOrder()
    }
  }
</script>

<style scoped>

</style>
